import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';

class NormalChip extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => NormalChipState();
}

class NormalChipState extends State<NormalChip> {
  int _valueChoice = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Chip'),
          centerTitle: true,
        ),
        body: Center(
          child: SingleChildScrollView(
            child: Column(
              children: <Widget>[
                SizedBox(
                  height: 10,
                ),
                Text('一、初步认识'),
                Divider(),
                Chip(
                  //必须的   显示的文字
                  label: Text('普通的Chip'),
                  labelStyle: TextStyle(color: Colors.black54),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('带avatar(Icon)的chip'),
                  avatar: Icon(
                    Icons.arrow_forward,
                    color: Colors.black54,
                  ),
                  labelStyle: TextStyle(color: Colors.black54),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('带avatar(CircleAvater)的chip'),
                  avatar: CircleAvatar(
                    backgroundImage: AssetImage('images/index_02.png'),
                    radius: 30,
                  ),
                  labelStyle: TextStyle(color: Colors.black54),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  avatar: CircleAvatar(
                    backgroundImage: AssetImage('images/index_02.png'),
                    radius: 30,
                  ),
                  label: Text('Padding为0，labelPadding不为0'),
                  labelPadding: EdgeInsets.all(15),
                  padding: EdgeInsets.all(0),
                  labelStyle: TextStyle(
                      color: Colors.black54,
                      fontSize: 10,
                      fontWeight: FontWeight.bold),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('带deleteIcon的chip'),
                  labelStyle: TextStyle(color: Colors.black54),
                  deleteIcon: Icon(Icons.close),
                  deleteIconColor: Colors.black54,
                  onDeleted: () {
                    print('点击了删除');
                  },
                  //点击删除图标后弹出的文本，类似于tooltip的效果
                  deleteButtonTooltipMessage: '弹出提示',
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('圆角矩形的chip'),
                  labelStyle: TextStyle(color: Colors.black54),
                  deleteIcon: Icon(Icons.close),
                  deleteButtonTooltipMessage: '弹出提示',
                  deleteIconColor: Colors.black54,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(2),
                  ),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('尺寸最小的chip'),
                  labelStyle: TextStyle(color: Colors.black54),
                  //它的两个值，一个为padded，一个为shrinkWrap，前者自带margin，后者好像没有margin，紧贴附近的控件
                  materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text('带阴影的chip'),
                  labelStyle: TextStyle(color: Colors.black54),
                  elevation: 10,
                  backgroundColor: Colors.orange,
                ),
                SizedBox(
                  height: 10,
                ),
              ],
            ),
          ),
        ));
  }
}
